<template>
  <div id="map" ref="mapRef" style="width: 100%; height: 400px"></div>
</template>

<script setup>
import { nextTick, onMounted, ref } from 'vue'

const map = ref(null)
const mapRef = ref(null)
onMounted(() => {
  nextTick(() => {
    initMap()
  })
})
// 经纬度
const formData = ref({
  lat: 39.98412,
  lng: 116.307484
})
const initMap = () => {
  //定义地图中心点坐标
  const mapCenter = new TMap.LatLng(formData.value.lat, formData.value.lng)
  map.value = new TMap.Map(mapRef.value, {
    center: mapCenter, //设置地图中心点坐标
    zoom: 17, //设置地图缩放级别
    pitch: 0, //设置俯仰角
    rotation: 0, //设置地图旋转角度
    viewMode: '2D'
  })
}
</script>

<style lang="scss" scoped>
</style>